<!--
 * @Description:
 * @version: v0.0.1
 * @Author: ZhouYanPing
 * @Date: 2025-04-07 23:29:16
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2025-04-07 23:45:44
-->
<template>
  <view class="content">
    <image class="logo" :src="envConfig.logo" />
    <view class="text-area">
      <text class="title">{{ title }}</text>
      <text class="env">当前环境: {{ currentEnv }}</text>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref, computed } from 'vue';
import { getEnv, getEnvConfig } from '@/config/env';

const title = ref('Hello');

console.log('import.meta.env', import.meta.env);
const currentEnv = ref(getEnv());
const envConfig = computed(() => getEnvConfig());
</script>

<style>
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.logo {
  height: 200rpx;
  width: 200rpx;
  margin-top: 200rpx;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50rpx;
}

.text-area {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.title {
  font-size: 36rpx;
  color: #8f8f94;
}

.env {
  font-size: 24rpx;
  color: #999;
  margin-top: 20rpx;
}
</style>
